<template>
  <div class="registartionSettings-content">
      <el-tabs
        v-model="types" v-if="menuItem.length > 0"
        class="custom-tabs"
      >
        <el-tab-pane
          v-for="tab in menuItem"
          :key="tab.perms"
          :label="tab.menuName"
          :name="tab.perms"
        >
        </el-tab-pane>
      </el-tabs>
      <div class="registrationSettings" v-if="types === 'manage-storage-storage'">
        <storage />
      </div>
      <div class="registrationSettings" v-if="types === 'manage-storage-mfr'">
        <mfr />
      </div>
  </div>
</template>
<script setup lang="ts">
import storage from './storage/index.vue';
import mfr from './mfr/index.vue';
import stores from '@/store';

const route = useRoute();
let menuList = ref<any>( await stores.useBaseDataStore().findMenuList(route.query.submenuId));
menuList.value.filter((item:any) => {
  return item.menuType == 2;
})
let menuItem = ref<any>(menuList.value);
const types = ref<string>(menuItem.value[0].perms); // 默认选中标签

</script>
<style lang="scss" scoped>
.registrationSettings {
  height: calc(100% - 52px);
}
.registartionSettings-content {
  height: 100%;
}
::v-deep(.el-tabs__item) {
  width: 110px !important; /* 设置每个tab的宽度 */
  padding: 0 !important; /* 去除默认padding */
  font-size: 16px !important; /* 设置字体大小 */
}
::v-deep(.el-tabs__nav-wrap:after){
    height: 1px !important;
}
</style>
